<!-- 备件管理-备件基础数据页面 -->
<template>
  <div class="equip-wrap-common">
    <CustomTabs :tabList="tabList" :activeName="activeName" @tabSelect="handelTabSelected" />
    <TypeTable v-if="activeName === '1'" :activeName="activeName" />
    <BrandTable v-if="activeName === '2'" :activeName="activeName" />
    <ModelTable v-if="activeName === '3'" :activeName="activeName" />
  </div>
</template>

<script setup lang="ts">
defineOptions({
  name: "ALL_EQUIP_SPAREPARTS_BASEDATA"
});
import { reactive, toRefs } from "vue";
import CustomTabs from "@/components/Tabs/index.vue";
import TypeTable from "./components/TypeTable.vue";
import ModelTable from "./components/ModelTable.vue";
import BrandTable from "./components/BrandTable.vue";
const state = reactive<any>({
  tabList: [
    {
      name: "1",
      label: `类型`
    },
    {
      name: "2",
      label: `品牌`
    },
    {
      name: "3",
      label: `型号`
    }
  ],
  activeName: "1"
});
const { tabList, activeName } = toRefs(state);
// 切换tabs调用接口
const handelTabSelected = selectName => {
  activeName.value = selectName;
};
</script>

<style lang="scss" scoped>
@import url("@/views/all/equip/scss/table-list.scss");
</style>
